$radius: 150rpx;
.cover-container {
  z-index: -1;
}
.index-container { 
  height: fit-content;
  //background-color: rgba(245, 245, 245, 0.9);
  background: linear-gradient(180deg, rgba(250, 250, 250, 0.85), rgba(245, 245, 245, 0.9));
  backdrop-filter: blur(20rpx);
  .bor{
    border-radius: 20rpx;
  }
  .far {
    width: 50rpx;
    margin-bottom: 10rpx;
    font-size: 42rpx;
  }
  .title-text {
    @include ellipsis(1);
  }
  .cover-image-container {
    border-bottom-left-radius: $radius;
    
    .image {
      transition-duration: 100ms;
    }

    .float-tips {
      transition-duration: 100ms;

      .tips {
        width: fit-content;
        background-color: rgba(50, 50, 50, 0.7);
        backdrop-filter: blur(6rpx);
        -webkit-backdrop-filter: blur(6rpx);
      }
    }
  }

  .content-wrapper {
    top: -$radius;
    //border-top-right-radius: $radius;
    border-top-right-radius: 50rpx;
    transition: {
      property: border-top-right-radius;
      duration: 200ms;
    };

    &::before {
      content: '';
      position: absolute;
      left: 0;
      top: -$radius;
      width: $radius;
      height: $radius;
      background: radial-gradient(circle at 100% 0%, transparent $radius, white 0);
      background: -webkit-radial-gradient(100% 0%, circle, transparent $radius, white 0)
    }

    .content-container {
      .content {
        .notice {
          white-space: pre-line;
          line-height: 1.3rem;
        }
      }
    }
  }
}
